<%--
  Created by IntelliJ IDEA.
  User: xh
  Date: 2020/2/4
  Time: 15:41
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>欢迎注册 - 技术栈 - Java程序员成长平台</title>
    <meta name="keywords" content="">
    <meta name="description" content>
    <link rel="stylesheet" href="vendor/layui-v2.4.5/layui/css/layui.css">
    <link rel="stylesheet" href="css/common.css">
    <link rel="stylesheet" href="css/header.css">
    <link rel="stylesheet" href="css/footer.css">
    <link rel="stylesheet" href="css/register.css">
    <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
    <!--[if lt IE 9]>
    <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
    <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>
<body>
<div class="g-header">
    <div class="layui-main">
        <a href="index.html">
            <img src="img/logo.png" class="logo">
        </a>
        <ul class="layui-nav" lay-filter="">
            <li class="layui-nav-item item"><a href="/toLogin"><i class="layui-icon layui-icon-username">&nbsp;已有帐号，我要登录</i></a></li>
        </ul>
    </div>
</div>

<div class="layui-main layui-row g-main ">
    <h1 class="text">欢迎注册</h1>
    <div class="layui-col-xs6 layui-col-xs-offset3">
        <div class=" layui-row  main-content">
            <div class="layui-col-xs6 layui-col-xs-offset3 l-content ">
                <form action="/doRegister" id="registerForm" method="post">
                    <div class="item"><input class="layui-input" name="tel" id="tel" placeholder="请输入手机号"></div>
                    <div class="layui-row item">
                        <div class="layui-col-xs7"><input placeholder="验证码" class=" layui-input"></div>
                        <div class="layui-col-xs4 layui-col-xs-offset1"><img src="img/captcha.png" width="100%" height="100%"></div>
                    </div>
                    <div class="layui-row item">
                        <div class="layui-col-xs7"><input placeholder="短信验证码" class=" layui-input"></div>
                        <div class="layui-col-xs4"><input class="layui-btn layui-btn-primary layui-col-xs-offset1 layui-btn-disabled" type="button" value="获取验证码" disabled></div>
                    </div>
                    <div class="item"><input placeholder="昵称" name="username" id="username" class="layui-input"></div>
                    <div class="item"><input placeholder="登录账号" name="account" id="account" class="layui-input"></div>
                    <div class="item"><input placeholder="密码" name="password" id="password" class="layui-input"></div>
                    <div class="item"><input placeholder="确认密码" id="password2" class="layui-input"></div>
                    <div class="item"><input class="layui-btn layui-btn-fluid btn" type="button" value="立即注册" onclick="register()"></div>
                </form>
            </div>
        </div>
    </div>
</div>

<div class="g-footer layui-clear">
    <hr>
    <div>Copyright ©2018 技术栈(jishuzhan.club), All Rights Reserved.</div>
    <div>渝ICP备13001123号-2</div>
</div>

<script src="vendor/holder.min.js"></script>
<script src="jquery/jquery-2.1.1.min.js"></script>
<script src="layer/layer.js"></script>
<%--<script src="js/common.js"></script>--%>
<%--<script src="js/register.js"></script>--%>

<script>

//        $(function(){
//            alert("jquery是能用的！");
//        });
    function register(){


        // 获取用户数据的数据
        var loginAccount = $("#account").val();
        var password=$("#password").val();
        var username=$("#username").val();
        var tel=$("#tel").val();
        var password2=$("#password2").val();

        if(loginAccount == ''){
            layer.msg("账号不能为空！", {time: 3000, icon: 5, shift: 6}, null);
            return;
        }
        if(username == ''){
            layer.msg("用户名不能为空！", {time: 3000, icon: 5, shift: 6}, null);
            return;
        }
        if(password == ''){
            layer.msg("密码不能为空！", {time: 3000, icon: 5, shift: 6}, null);
            return;
        }

        if(tel == ''){
            layer.msg("电话号码不能为空！", {time: 3000, icon: 5, shift: 6}, null);
            return;
        }

        if(password!=password2){
            layer.msg("两次密码不一致", {time: 3000, icon: 5, shift: 6}, null);
            return;
        }

        var loadingIndex = null;


        $.ajax({
            url : "${APP_PATH}/user/doRegister",
            method : 'POST',
            data : {
                account : loginAccount,
                username : username,
                password: password,
                tel:tel
            },
            beforeSend : function(){
                loadingIndex = layer.msg('正在插入，请稍后~~', {icon: 16});
            },
            success : function ( result ){
                if( result.success ){
                    layer.msg("注册成功！", {time: 3000, icon: 6, shift: 4}, function(){
                        // 跳转页面
                        window.location.href="/toLogin";
                    });
                } else {
                    layer.msg("注册失败了，请联系管理员！", {time: 3000, icon: 5, shift: 6}, null);
                }
            },
            complete : function(){
                layer.close(loadingIndex);
            }
        });
    }
</script>
</body>
</html>
